<template>
  <div>
    <!-- 遍历按钮配置，一行代码生成一排徽章按钮 -->
    <badge-button
      v-for="(btn, idx) in badgeList"
      :key="idx"
      :value="btn.value"
      :text="btn.text"
      :type="btn.type"
    />
  </div>
</template>

<script>
import BadgeButton from "@/components/Abstract/AbstractBadge.vue";

export default {
  components: { BadgeButton },
  data() {
    return {
      badgeList: [
        { value: 101, text: "评论", type: "danger" },
        { value: 3, text: "回复", type: "danger" },
        { value: 1, text: "评论", type: "primary" },
        { value: 2, text: "回复", type: "warning" },
      ],
    };
  },
};
</script>